<template>
  <!-- 引入并使用自定义导航栏组件 -->
  <custom-navbar title="创建订单" show="true"></custom-navbar>
  <!-- 页面内容区域，确保内容不被导航栏遮挡 -->
  <scroll-view scroll-y="true" class="contentBox">
	  <view class="item-content-view" @click="chooseAddress">
	  	<view style="flex-grow: 1;display: flex;flex-direction: column;">
	  		<text>张三 15829646496</text>
	  		<text style="color: darkgray;margin-top: 20rpx;">陕西省铜川市耀州区</text>
	  	</view>
		<uni-icons type="right"></uni-icons>
	  </view>
	  <view class="item-content-view" style="margin-top: 20rpx;">
	  	<view style="height: 200rpx;width: 200rpx;background-color: lightgray;border-radius: 5rpx;">
	  		
	  	</view>
		<view style="margin-left: 20rpx;display: flex;flex-direction: column;">
			<text>洛川大苹果</text>
			<uni-number-box style="margin-top: 40rpx;" :disabled="isCard==1" v-model="number"></uni-number-box>
		</view>
	  </view>
	  <view class="item-content-view">
	  	<text></text>
	  </view>
   </scroll-view>
   <view class="bottom-view" @click="submitData">
	确认
   </view>
</template>

<script>
import CustomNavbar from '@/components/CustomNavbar.vue';
import {wxToPay} from '@/tools/pay.js';

export default {
  components: {
    CustomNavbar,
  },
  onLoad(option) {
	  console.log(`=======${option.isCard}`);
	  if(option.isCard==undefined){
		  this.isCard = 1;
	  }else{
		  this.isCard = option.isCard
	  }
  },
  data () {
	  return {
		isCard: 1,
		number: 1
	  }
  },
  methods: {
		submitData() {
			console.log('========submitData')
			 wxToPay();
		},
		chooseAddress() {
			uni.navigateTo({
				url:'/pages/mine/address?isChoose=1'
			})
		}
  }
};
</script>

<style lang="scss">
page {
  background-color: #f7f7f7;
  // 总容器高度撑满屏幕
  height: 100%;
  // 使容器内元素使用flex布局
  display: flex;
  flex-direction: column;
}
.contentBox {
  /* 确保内容不被导航栏遮挡 */
  flex-grow: 1;
  height: 1rpx;
  margin: 20rpx;
  width: calc(100% - 40rpx);
  display: flex;
  flex-direction: column;
}

.item-content-view {
	background-color: white;
	display: flex;
	flex-direction: row;
	padding: 20rpx;
	align-items: center;
	border-radius: 10rpx;
}

.bottom-view {
	height: 100rpx;
	background-color: red;
	padding-bottom: 20rpx;
	text-align: center;
	color: white;
	font-size: 36rpx;
	line-height: 100rpx;
	font-weight: bold;
}
</style>